Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
2 Skipped Deployments
|
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
There was a problem hiding this comment.
Pull request overview
This PR adds a new optional style parameter to the badge API that allows users to switch between the default badge style and a shields.io-compatible style. The implementation introduces accurate text measurement using the @napi-rs/canvas library with fallback to character-based estimation.
Changes:
- Added
@napi-rs/canvasdependency for accurate text width measurement - Implemented two badge rendering functions:
renderDefaultBadgeSvgandrenderShieldsBadgeSvg - Added
stylequery parameter validation with values 'default' and 'shieldsio'
Reviewed changes
Copilot reviewed 3 out of 4 changed files in this pull request and generated 8 comments.
| File | Description |
|---|---|
| package.json | Added @napi-rs/canvas dependency (v0.1.92) |
| pnpm-lock.yaml | Lockfile updates for @napi-rs/canvas and its platform-specific binaries |
| server/api/registry/badge/[type]/[...pkg].get.ts | Implemented style parameter, canvas-based text measurement, and two SVG rendering functions |
| test/e2e/badge.spec.ts | Added E2E tests for default and shieldsio style parameters |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
| function OLD_measureTextWidth(text: string): number { | ||
| return Math.max(MIN_BADGE_TEXT_WIDTH, Math.round(text.length * CHAR_WIDTH) + BADGE_PADDING_X * 2) | ||
| } |
There was a problem hiding this comment.
The function name OLD_measureTextWidth suggests this is temporary legacy code. While keeping backward compatibility fallback is appropriate, the naming convention with all caps and underscore prefix is inconsistent with the codebase conventions (camelCase). Consider renaming to something like measureTextWidthFallback or legacyMeasureTextWidth to better communicate its purpose.
This PR improves badge appearance by using a more accurate method to measure text width. Instead of relying on a predefined character width, it utilizes the Canvas API to measure the actual width of the text, resulting in better alignment and spacing for badges with varying character widths.
Speaking in code, this is how the old and new methods compare:
{ label: 'iiiiiiiiii', leftWidthOld: 86, leftWidth: 41 }
{ label: 'wwwwwwwwww', leftWidthOld: 86, leftWidth: 97 }
2 participants
Depends on #1486
This PR implements a new, optional parameter in badges API:
style. By passingstyle=shieldsiowe change the appearance of the generated shields from the default one to custom one.Default:
Default with custom color:
shields.io-style:
shields.io-style with custom color:
